<!DOCTYPE html>
<html lang="en" xmlns:shiro="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/layui/css/layui.css">
    <link rel="stylesheet" href="/css/custom.form.css">
</head>
<body>
<div class="panel panel-default operation" hidden>
    <div class="panel-heading title"></div>
    <div class="layui-card-body">
        <form class="layui-form " action="" lay-filter="info" style="width: 700px;margin-top: 10px">
            <div class="layui-form-item">
                <label class="layui-form-label">表名</label>
                <div class="layui-input-block">
                    <input readonly type="tableName" name="tableName"  class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">菜单名称</label>
                <div class="layui-input-block">
                    <input type="menuName" name="menuName" placeholder="请输入菜单名称" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">上级菜单</label>
                <div class="layui-input-block">
                    <select id="pid" name="pid">
                        <option value="">请选择内容</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">角色</label>
                <div class="layui-input-block">
                    <input value="超级管理员" readonly  class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button type="submit" class="layui-btn" lay-submit="" lay-filter="submit">保存</button>
                    <button class="layui-btn layui-btn-primary" id="btn_cancel">返回</button>
                </div>
            </div>
        </form>
    </div>
</div>

<div class="table_div">
    <table class="layui-table" id="showTable" lay-filter="showTable"></table>

</div>
<script type="text/html" id="tool">
    <a class="layui-btn layui-btn-xs" lay-event="add" shiro:hasPermission="sysGenerator:add">生成</a>
</script>
</body>
</html>
<script src="/layui/layui.all.js"></script>
<script src="/js/core.util.js?v=1111"></script>
<script>
    var layer = layui.layer;
    var table = layui.table;
    var form = layui.form;
    var $ = layui.$;

    //渲染table
    table.render({
        elem: '#showTable'
        , height: 'full-20'
        , page: true //开启分页
        , url: '/sysGenerator/listByPage' //数据接口
        , method: "POST"
        , contentType: 'application/json;charset=utf8'
        , headers: {'authorization': CoreUtil.getData("access_token")}
        , parseData: function (res) { //res 即为原始返回的数据
            //select
            addOption();
            $(".layui-table-tool-temp").html("生成之前，请确保要生成的表已设置主键列为id；生成完成后，请重启应用")
            return {
                "code": res.code, //解析接口状态
                "msg": res.msg, //解析提示文本
                "count": res.data.total, //解析数据长度
                "data": res.data.records //解析数据列表
            };
        }
        , cols: [
            [ //表头
                {field: 'tableName', title: '表名', width: 200, sort: true},
                {field: '', title: '是否已生成', width: 150, sort: true
                    ,templet: function (d) {
                        if (!CoreUtil.isEmpty(d.id)) {
                            return '是'
                        } else {
                            return '否'
                        }
                    }},
                {field: 'menuName', title: '菜单名称', width: 200, sort: true},
                {field: 'genTime', title: '生成时间', width: 200, sort: true},
                {width: 100, toolbar: "#tool", title: '操作'}
            ]
        ]
        , toolbar: '#toolbar' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
        , id: 'tableId' //reload用
    });

    //刷新table
    var reloadTable = function () {
        var key = $('#key').val();
        //执行重载
        table.reload('tableId', {
            where: {
                "key": key
            }
        }, 'data');
    }
    //搜索
    $('#search').click(function () {
        reloadTable();
    })

    //获取以及目录
    var addOption = function () {
        CoreUtil.sendAjax("/sysGenerator/getOneMenuList", null, function (res) {
            var data = res.data;
            if (data != "" && data != null) {
                for (var i = 0; i < data.length; i++) {
                    $("#pid").append("<option value='" + data[i].id + "'>" + data[i].name + "</option>");
                }
                form.render();
            }

        }, "GET", false, function (res) {
            layer.msg("抱歉！您暂无权限");
        });
    }



    //列操作
    table.on('tool(showTable)', function (obj) {
        var data = obj.data;
        switch (obj.event) {
            case 'add':
                if (!CoreUtil.isEmpty(data.id)) {
                    layer.msg("请勿重复生成")
                    break;
                }
                $(".table_div").hide();
                $(".operation").show();
                $(".title").html("代码生成");
                $(".operation input[name=tableName]").val(data.tableName);
                $(".operation input[name=menuName]").val("");
                $(".operation input[name=pid]").val("");
                break;
        }
    });

    //返回
    $("#btn_cancel").click(function () {
        $(".table_div").show();
        $(".operation").hide();
        return false;
    });

    //监听保存
    form.on('submit(submit)', function (data) {
        console.log(JSON.stringify(data.field))
        if (CoreUtil.isEmpty(data.field.tableName)){layer.msg("菜单名称不能为空");}
        if (CoreUtil.isEmpty(data.field.pid)){layer.msg("请选择上级目录");}
        CoreUtil.sendAjax("/sysGenerator/add", JSON.stringify(data.field), function (res) {
            $(".table_div").show();
            $(".operation").hide();
            reloadTable();
            layer.msg("代码生成成功，请重启应用查看")
        }, "POST", false, function (res) {
            layer.msg("抱歉！您暂无权限");
        });

        return false;
    });
</script>